<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="layout" content="wechat"/>
    <title>免费评房</title>
</head>

<body>

<div class="wxAutoCreat">
    <g:form action="wxCreate3Step2" id="${this.opportunity?.id}" method="post" class="wxCreate3Form1">
        <input type="hidden" name="openId" value="${this.openId}"/>
        <div class="bgcWhite wxCreate weui-cells weui-cells_form">
            <div class="weui-cell weui-cell_select" style="padding-left: 15px">
                <div class="weui-cell__hd"><label class="weui-label">贷款类型</label></div>
                <div class="weui-cell__bd weui-cell_primary">
                    <g:select class="weui-select" name="loanType" id="loanType" from="['按揭', '消费', '经营']" value="" noSelection="['':'请选择贷款类型']"/>
                </div>
            </div>

            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">贷款金额</label></div>

                <div class="weui-cell__bd weui-cell_primary">
                    <g:textField class="weui-input" type="text" id="requestedAmount" name="requestedAmount" value="${this.opportunity?.requestedAmount}" placeholder="请输入贷款金额" autocomplete="off"/>
                </div>
            </div>

            <div class="weui-cell weui-cell_select pl-15">
                <div class="weui-cell__hd"><label class="weui-label">网点选择</label></div>
                <div class="weui-cell__bd weui-cell_primary">
                  <g:select class="weui-select" name="branchNetwork" id="branchNetwork" from="['广州', '佛山', '东莞', '中山', '江门', '珠海', '湛江', '汕头', '惠州']" value="" noSelection="['':'请选择网点']"/>
                </div>
            </div>
            <g:if test="${!this.opportunity?.contact}">
            <div class="weui-cell">
                <div class="weui-cell__hd"><label
                        class="weui-label">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</label></div>

                <div class="weui-cell__bd weui-cell_primary">
                    <g:textField class="weui-input" type="text" name="contact.fullName" id="fullName"
                                 value="${this.opportunity?.contact?.fullName}" autofocus="autofocus"/>
                </div>
            </div>

            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">手&nbsp;&nbsp;机&nbsp;&nbsp;号</label></div>

                <div class="weui-cell__bd weui-cell_primary">
                    <g:field class="weui-input" type="number" name="contact.cellphone" id="cellphone"
                             value="${this.opportunity?.contact?.cellphone}" />
                </div>


            </div>

            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">验&nbsp;&nbsp;证&nbsp;&nbsp;码</label></div>

                <div class="weui-cell__bd weui-cell_primary">
                    <g:field class="weui-input" type="number" placeholder="请输入手机收到的验证码" name="contact.verifiedCode"
                             id="verifiedCode" />
                </div>
                <div class="weui-cell_ft">
                    <input id="btnSendVerifiedCode" type="button"
                           class="vCode-btn weui-btn weui-btn_mini weui-btn_plain_default" value="发送验证码"/>
                </div>
            </div>
            </g:if>
        </div>

        <div class="bigBtn">
            <button type="button" class="linkBtn weui-btn weui-btn_plain_default" id="wxcreate3Step1Btn">申请贷款</button>
        </div>
    </g:form>
</div>



%{--提示信息和验证--}%
<div class="message-box" style="top: 20%;">
    <div class="helpMsg hide"></div>
    <g:if test="${flash.message}">
        <div class="message" role="status">
            ${flash.message}
        </div>
    </g:if>
</div>

<script>
    $(function () {
      var time = 30;
      var interval;
      $('#btnSendVerifiedCode').click(function () {
          if (!$("#cellphone").val().trim()) {
              $(".helpMsg").text("请输入手机号").fadeIn(200);
              $('#btnSendVerifiedCode').addClass("vCodeActive").attr('disabled', 'disabled');
              setTimeout(function () {
                  $(".helpMsg").fadeOut(200);
                  $('#btnSendVerifiedCode').removeClass("vCodeActive").removeAttr('disabled');
              }, 2000);
              return;
          }

          if (/^(13[0-9]|14[0-9]|15[0-9]|17[0-9]|18[0-9])\d{8}$/.test($("#cellphone").val())) {
              $.ajax({
                  type: "POST",
                  url: "/contact/sendVerifiedCode",
                  data: {
                      cellphone: $("#cellphone").val(),
                      operation: "register"
                  },
                   beforeSend:function(){
                      interval = setInterval(function () {
                              if (time > 0) {
                                  $('#btnSendVerifiedCode').attr('disabled', 'disabled').addClass("vCodeActive");
                                  $('#btnSendVerifiedCode').val("" + (time--) + '秒后重试');
                              } else {
                                  $('#btnSendVerifiedCode').removeAttr('disabled').removeClass("vCodeActive");
                                  $('#btnSendVerifiedCode').val("获取验证码");
                                  time = 60;
                                  clearInterval(interval);
                              }
                          }, 1000);

                  },
                  success: function (data) {
                      if (data.status == "success") {
                          helpMessage("验证码发送成功");
                      }
                      if (data.status == "error") {
                          helpMessage(data.errorMessage);
                      }
                  },
              });
          } else {
              $('#cellphone').val('');
              helpMessage("请输入正确的手机号");
          }
      });
      setTimeout(function () {
          $(".message").fadeOut(200);
      }, 2000);

      // 参数合法性校验

        $("#wxcreate3Step1Btn").click(function () {

            var loanType = $("#loanType").val();
            if (!loanType) {
                helpMessage("请选择贷款类型");
                return;
            }

            var requestedAmount = $("#requestedAmount").val();
            if (!requestedAmount) {
                helpMessage("请输入贷款金额");
                return;
            }

            var branchNetwork = $("#branchNetwork").val();
            if (!branchNetwork) {
                helpMessage("请选择网点");
                return;
            }
            // var fullNameStr = $("#fullName").val().trim();
            // var cellphoneStr = $("#cellphone").val().trim();
            // var verifiedCodeStr = $("#verifiedCode").val().trim();
            //
            // if (!fullNameStr) {
            //     helpMessage("请输入姓名");
            //     return;
            // }
            // if (!(/^[\u2190-\u9fff]{1,10}$|^[\dA-Za-z]{1,20}$/.test(fullNameStr))) {
            //     helpMessage("姓名格式不正确");
            //     return;
            // }
            // if (!cellphoneStr) {
            //     helpMessage("请输入手机号");
            //     return;
            // }
            // if (!(/^(13[0-9]|14[0-9]|15[0-9]|17[0-9]|18[0-9])\d{8}$/.test(cellphoneStr))) {
            //     helpMessage("请输入正确的手机号");
            //     return;
            // }
            // if (!verifiedCodeStr) {
            //     helpMessage("请输入验证码");
            //     return;
            // }

            $(".wxCreate3Form1").submit();
        });
        function helpMessage(message) {
            $(".helpMsg").text(message).fadeIn(200);
            setTimeout(function () {
                $(".helpMsg").fadeOut(200);
            }, 2000);
        }
    })
</script>
</body>
</html>
